<script setup lang="ts">
import { ref } from 'vue'
import * as accountApi from '@/api/account'
import { message } from 'ant-design-vue'

// 提醒设置
let txValue = ref<Array<string>>([])
const txOptions = [
  { label: '平台登录异常提醒', value: '1' },
  { label: '出票失败提醒', value: '2' },
  { label: '出票成功提醒', value: '3' },
  { label: '每日业务总结', value: '4' },
  { label: '闲鱼无意图消息提醒', value: '5' },
  { label: '微信无意图消息提醒', value: '6' },
]
const txChange = (e: any) => {
  console.log('txe=', e)
}

// 提醒渠道
let txqdValue = ref<Array<string>>([])
const txqdOptions = [
  { label: '企微机器人', value: '1' },
  { label: '钉钉机器人', value: '2' },
]
const txqdChange = (e: any) => {
  console.log('txqde=', e)
}

// 自动识别报价
const autoPrice = ref<boolean>()
const autoChangePrice = async () => {
  console.log('autoPrice=', autoPrice.value)
  let params = {
    quotationStatus: autoPrice.value ? 1 : 2,
  }
}

// 自动回复
const autoReply = ref<boolean>()
const autoChangeReply = async () => {
  // console.log('autoReply=', autoReply.value)
  let params = {
    quotationStatus: autoReply.value ? 1 : 2,
  }
}

// 放映时间
let showTime = ref<number>(0)

// 观影提醒功能
let showTx = ref<string>('')

// 闲鱼打烊
let closeShop = ref<boolean>()
let closeShopDesc = ref<string>('')
const changeCloseShop = async () => {
  // console.log('closeShop=', closeShop.value)
  let params = {
    quotationStatus: closeShop.value ? 1 : 2,
  }
}

// 自动报价有效期
let effectTime = ref<number>(0)

// 自动发货
let autoDelivery = ref<boolean>()
const changeAutoDelivery = async () => {
  console.log('autoDelivery=', autoDelivery.value)
}

// 放映结束提醒收货
let receiveGood = ref<boolean>()
let receiveGoodDesc = ref<string>('')
const changeReceiveGood = async () => {
  // console.log('receiveGood=', receiveGood.value)
  let params = {
    quotationStatus: receiveGood.value ? 1 : 2,
  }
}

// 收货提醒
let endTx = ref<string>('')

onMounted(() => {
  getRobatList()
})

// 拉取机器人列表
let okRobat = ref<string>()
import type { SelectProps } from 'ant-design-vue'
const robatList = ref<SelectProps['options']>([])
const getRobatList = async () => {
  try {
    let {
      state,
      data,
      message: msg,
    } = await accountApi.getList({
      currentPage: 1,
      pageSize: 100,
    })
    if (state === 200) {
      robatList.value = data.list
    } else {
      message.error(msg)
    }
  } catch (error) {
    message.error('网络请求连接失败~')
  }
}
const selectRobat = (selectValue: any) => {
  okRobat.value = selectValue as string
}

// 推送配置
let sendRobat = ref<string>()
const selectSendRobat = (selectValue: any) => {
  sendRobat.value = selectValue as string
  // console.log('sendRobat.value=', sendRobat.value)
}
const pushRobot = async () => {
  // try {
  //   let { state, message: msg } = await questionAnswerApi.wechartScriptPushArriveRobots({})
  //   if (state === 200) {
  //     message.success('推送成功')
  //   } else {
  //     message.error(msg)
  //   }
  // } catch (error) {
  //   message.error('网络请求连接失败~')
  // }
}
const sendOk = () => pushRobot()
</script>

<template>
  <div>
    <div style="margin: 5px 0; text-align: right">
      <span>选择闲鱼账号：</span>
      <a-select
        v-model:value="okRobat"
        @change="selectRobat"
        placeholder="请选择"
        style="width: 150px; text-align: left"
      >
        <a-select-option v-for="(item, index) in robatList" :key="index" :value="item.id">
          {{ item.nickName }}
        </a-select-option>
      </a-select>
    </div>
    <div class="rowBox">
      <span class="label-1">提醒设置：</span>
      <a-checkbox-group v-model:value="txValue" :options="txOptions" @change="txChange" />
    </div>

    <div class="rowBox">
      <span class="label-1">提醒渠道：</span>
      <a-checkbox-group v-model:value="txqdValue" :options="txqdOptions" @change="txqdChange" />
    </div>

    <div class="rowBox">
      <span class="label-1">自动识别报价：</span>
      <span class="label-2">
        <a-switch v-model:checked="autoPrice" @change="autoChangePrice" />
      </span>
    </div>

    <div class="rowBox">
      <span class="label-1">自动回复：</span>
      <span class="label-2">
        <a-switch v-model:checked="autoReply" @change="autoChangeReply" />
      </span>
    </div>

    <div class="rowBox">
      <span class="label-1">放映时间限制：</span>
      <a-input-number
        class="iptWidth"
        :min="0"
        v-model:value="showTime"
        placeholder="最小设置为0，单位分钟"
      ></a-input-number>
      <span style="margin: 5px">分钟</span>
    </div>

    <div class="rowBox">
      <span class="label-1">观影提醒功能：</span>
      <a-input class="iptWidth" v-model:value="showTx"></a-input>
    </div>

    <div class="rowBox">
      <span class="label-1">打烊：</span>
      <span class="label-2">
        <a-switch v-model:checked="closeShop" @change="changeCloseShop" />
      </span>
      <a-input
        v-if="closeShop"
        v-model:value="closeShopDesc"
        class="iptWidth"
        style="margin: 0 5px"
        placeholder="打开后，用户付款后提示指定话术内容"
      ></a-input>
    </div>

    <div class="rowBox">
      <span class="label-1">自动报价有效期：</span>
      <a-input-number
        class="iptWidth"
        :min="0"
        v-model:value="effectTime"
        placeholder="判断距离用户上次报价记录的时间间隔"
      ></a-input-number>
      <span style="margin: 5px">分钟</span>
    </div>

    <div class="rowBox">
      <span class="label-1">自动发货：</span>
      <span class="label-2">
        <a-switch v-model:checked="autoDelivery" @change="changeAutoDelivery" />
      </span>
    </div>

    <div class="rowBox">
      <span class="label-1">放映结束提醒收货：</span>
      <span class="label-2">
        <a-switch v-model:checked="receiveGood" @change="changeReceiveGood" />
      </span>
      <a-input
        v-if="receiveGood"
        v-model:value="receiveGoodDesc"
        class="iptWidth"
        style="margin: 0 5px"
        placeholder="放映结束提醒收货"
      ></a-input>
    </div>

    <div class="rowBox">
      <span class="label-1">收货后提醒：</span>
      <a-input class="iptWidth" v-model:value="endTx"></a-input>
    </div>

    <!-- 推送 -->
    <div style="margin: 5px 0">
      <span>选择推送平台账号：</span>
      <a-select
        mode="multiple"
        v-model:value="sendRobat"
        @change="selectSendRobat"
        placeholder="请选择"
        style="width: 150px; text-align: left"
      >
        <a-select-option v-for="(item, index) in robatList" :key="index" :value="item.id">
          {{ item.nickName }}
        </a-select-option>
      </a-select>
      <a-button type="primary" style="margin-left: 10px;border-radius: 6px;" @click="sendOk">确认推送</a-button>
    </div>
  </div>
</template>

<style lang="less" scoped>
.hiddenText {
  display: inline-block;
  width: 1000px;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

a:hover {
  color: red;
}

.rowBox {
  display: flex;
  margin-bottom: 15px;
  // background: pink;
}

.label-1 {
  width: 140px;
  text-align: center;
  line-height: 30px;
}

.iptWidth {
  width: 500px;
}
</style>
